<!-- 非ID卡退费 -->
<!-- 非ID卡缴费 -->
<template>
    <div class="app-container return">
        <el-row :gutter="20">
            <!--企业数据-->
            <el-col :span="4" :xs="24">
                <div class="head-container">
                    <el-input v-model="deptName" placeholder="请输入名称" clearable size="small" prefix-icon="el-icon-search"
                        style="margin-bottom: 20px" />
                </div>
                <div class="head-containers">
                    <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false"
                        :filter-node-method="filterNode" ref="tree" node-key="id" default-expand-all highlight-current
                        @node-click="handleNodeClick" />
                </div>
            </el-col>
            <!--小区数据-->
            <el-col :span="20" :xs="24">
                <el-card class="box-card" style="margin-bottom: 20px;">
                    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" s
                        style="display: flex;align-items: center;" label-width="80px">
                        <el-row>
                            <el-col :xs="12" :sm="8" :md="8" class="elcol">
                                <el-form-item label="客户类型" prop="customerType">
                                    <el-select v-model="queryParams.customerType" filterable placeholder="请选择">
                                        <el-option v-for="dict in dict.type.customer_type" :key="dict.value"
                                            :label="dict.label" :value="dict.value" />
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :xs="12" :sm="8" :md="8" class="elcol">
                                <el-form-item label="客户名称" prop="customerName">
                                    <el-input v-model="queryParams.customerName" placeholder="请输入客户名称" clearable />
                                </el-form-item>
                            </el-col>
                            <el-col :xs="12" :sm="8" :md="8" class="elcol">

                                <el-form-item label="客户编号" prop="customerCode">
                                    <el-input v-model="queryParams.customerCode" placeholder="请输入客户编号" clearable />
                                </el-form-item></el-col>
                            <el-col :xs="12" :sm="8" :md="8">
                                <el-form-item label="表号" prop="meterCode">
                                    <el-input v-model="queryParams.meterCode" placeholder="请输入表号" clearable />
                                </el-form-item>
                            </el-col>
                            <el-col :xs="12" :sm="8" :md="8">
                                <el-form-item label="身份证号" prop="idNumber">
                                    <el-input v-model="queryParams.证件号" placeholder="请输入身份证号" clearable />
                                </el-form-item>
                            </el-col>
                            <el-col :xs="12" :sm="8" :md="8">
                                <el-form-item label="手机号" prop="telephone">
                                    <el-input v-model="queryParams.telephone" placeholder="请输入手机号" clearable />
                                </el-form-item>
                            </el-col>
                            <el-col :span="4" :offset="20" style="margin-top:10px">
                                <el-form-item>
                                    <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery"
                                        style="margin-left: 10px;">搜索</el-button>
                                    <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </el-card>
                <el-row :gutter="20">
                    <el-col :span="11" :xs="24">
                        <el-card class="box-card" style="min-height: 660px;">
                            <el-table v-loading="loading" :data="userList" border @row-click="tableClick">
                                <el-table-column label="客户名称" align="center" key="customerName" prop="customerName"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="客户类型" align="center" key="customerType" prop="customerType"
                                    :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <dict-tag :options="dict.type.customer_type" :value="scope.row.customerType" />
                                    </template>
                                </el-table-column>
                              <el-table-column label="表号" align="center" key="meterCode" prop="meterCode"
                                               :show-overflow-tooltip="true" width="120"/>
                                <el-table-column label="证件号" align="center" key="idNumber" prop="idNumber"
                                    :show-overflow-tooltip="true" width="100" />
                                <el-table-column label="总购气金额" align="center" key="totalAmout" prop="totalAmout"
                                    :show-overflow-tooltip="true" width="120" />
                                <el-table-column label="余额" align="center" key="remainAmout" prop="remainAmout"
                                    :show-overflow-tooltip="true" width="100" />

                                <el-table-column label="总用气量" align="center" key="totalVolume" prop="totalVolume"
                                    :show-overflow-tooltip="true" width="120" />
                                <el-table-column label="剩余气量" align="center" key="remainVolume" prop="remainVolume"
                                    :show-overflow-tooltip="true" width="120" />
                                <el-table-column label="计费周期开始时间" align="center" key="cycleStartTime" prop="cycleStartTime"
                                    :show-overflow-tooltip="true" width="150" />
                                <el-table-column label="计费周期结束时间" align="center" key="cycleEndTime" prop="cycleEndTime"
                                    :show-overflow-tooltip="true" width="150" />
                                <el-table-column label="周期内总用气量" align="center" key="cycleUseGas" prop="cycleUseGas"
                                    :show-overflow-tooltip="true" width="150" />
                                <el-table-column label="周期内总使用金额" align="center" key="cycleUseAmount" prop="cycleUseAmount"
                                    :show-overflow-tooltip="true" width="150" />
                                <el-table-column label="充值次数" align="center" key="payCount" prop="payCount"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="单元号" align="center" key="unit" prop="unit"
                                    :show-overflow-tooltip="true" width="100" />
                                <el-table-column label="楼栋号" align="center" key="building" prop="building"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="楼层号" align="center" key="floor" prop="floor"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="门牌号" align="center" key="houseNo" prop="houseNo"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="客户地址" align="center" key="customerAddress" prop="customerAddress"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="账单日" align="center" key="billDay" prop="billDay"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="自动发送短信" align="center" key="isAutoSendmsg" prop="isAutoSendmsg"
                                    :show-overflow-tooltip="true" width="120">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.isAutoSendmsg == 'N'">否</span>
                                        <span v-if="scope.row.isAutoSendmsg == 'Y'">是</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="是否加入黑名单" align="center" key="isBlack" prop="isBlack"
                                    :show-overflow-tooltip="true" width="120">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.isBlack == 'N'">否</span>
                                        <span v-if="scope.row.isBlack == 'Y'">是</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="是否给客户发送短信" align="center" key="isSendMsg" prop="isSendMsg"
                                    :show-overflow-tooltip="true" width="150">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.isSendMsg == 'N'">否</span>
                                        <span v-if="scope.row.isSendMsg == 'Y'">是</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="是否欠费关阀" align="center" key="isCloseOverdue" prop="isCloseOverdue"
                                    :show-overflow-tooltip="true" width="120">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.isCloseOverdue == 'N'">否</span>
                                        <span v-if="scope.row.isCloseOverdue == 'Y'">是</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="是否缴费开阀" align="center" key="isOpenPaid" prop="isOpenPaid"
                                    :show-overflow-tooltip="true" width="100">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.isOpenPaid == 'N'">否</span>
                                        <span v-if="scope.row.isOpenPaid == 'Y'">是</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="短信提醒号码" align="center" key="messagePhone" prop="messagePhone"
                                    :show-overflow-tooltip="true" width="120" />
                                <el-table-column label="开户日期" align="center" key="openDate" prop="openDate"
                                    :show-overflow-tooltip="true" />
                                <!-- <el-table-column label="充值次数" align="center" key="payCount" prop="payCount"
                                    :show-overflow-tooltip="true" /> -->
                                <el-table-column label="联系电话" align="center" key="telephone" prop="telephone"
                                    :show-overflow-tooltip="true" />

                                <el-table-column label="备注" align="center" key="remark" prop="remark"
                                    :show-overflow-tooltip="true" />
                            </el-table>

                            <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" small="true"
                                layout="total, prev, pager, next, jumper" :limit.sync="queryParams.pageSize"
                                @pagination="getList" />
                        </el-card>
                    </el-col>
                    <el-col :span="13" :xs="24">
                        <el-card class="box-card">
                            <el-form :model="formArr" ref="queryForms" size="small" v-show="showSearch" label-width="130px">
                                <div class="box-card_table">
                                    <el-form-item label="客户名称" prop="customerName" class="form_item" style="width:50%">
                                        <el-input v-model="formArr.customerName" placeholder="请输入客户名称" disabled clearable />
                                    </el-form-item>
                                    <el-form-item label="手机号码" prop="telephone" class="form_item" style="width:50%">
                                        <el-input v-model="formArr.telephone" placeholder="请输入手机号码" disabled clearable />
                                    </el-form-item>
                                </div>

                                <el-form-item label="客户地址" prop="customerAddress" class="form_item">
                                    <el-input v-model="formArr.customerAddress" placeholder="请输入客户地址" disabled clearable />
                                </el-form-item>
                                <div class="box-card_table">
                                    <el-form-item label="总用气量" prop="remainVolume" class="form_item" style="width:50%">
                                        <el-input v-model="formArr.remainVolume" placeholder="请输入总用气量" disabled clearable />
                                    </el-form-item>
                                    <el-form-item label="短信提醒手机号码" prop="messagePhone" class="form_item" style="width:50%">
                                        <el-input v-model="formArr.messagePhone" placeholder="请输入短信提醒手机号码" disabled
                                            clearable />
                                    </el-form-item>
                                </div>
                                <div class="box-card_table">
                                    <el-form-item label="账户余额(元)" prop="remainAmout" class="form_item" style="width:50%">
                                        <el-input v-model="formArr.remainAmout" placeholder="请输入账户余额" disabled clearable />
                                    </el-form-item>
                                    <el-form-item label="欠费关阀" prop="isOpenPaid" class="form_item" style="width:50%">
                                        <el-input v-model="formArr.isOpenPaid === 'Y' ? '是' : '否'" disabled clearable />
                                    </el-form-item>
                                </div>
                                <div class="box-card_table">
                                    <el-form-item prop="paidAmount" class="form_item" style="width:50%">
                                        <template slot="label">
                                            <div class="label_sty">退费金额(元)</div>
                                        </template>
                                        <el-input v-model="formArr.paidAmount" placeholder="请输入缴费金额" clearable
                                            @change="paymentAmount" />
                                    </el-form-item>
                                    <el-form-item label="交易方式" prop="tradeType" class="form_item" style="width:50%">
                                        <el-select v-model="formArr.tradeType" filterable placeholder="请选择交易方式">
                                            <el-option label="退费" value="4"> </el-option>
                                        </el-select>
                                    </el-form-item>
                                </div>
                                <div class="box-card_table">
                                    <el-form-item prop="userName" class="form_item" style="width:50%">
                                        <template slot="label">
                                            <div class="label_sty">退费后余额(元)</div>
                                        </template>
                                        <el-input v-model="balance" placeholder="请输入缴费后余额" disabled clearable />
                                    </el-form-item>
                                    <el-form-item label="计费方案" prop="userName1" class="form_item" style="width:50%">
                                        <el-input v-model="formArr.userName1" placeholder="请输入计费方案" disabled clearable />
                                    </el-form-item>
                                </div>
                                <el-form-item label="备注" prop="remark" class="form_item">
                                    <el-input v-model="formArr.remark" placeholder="请输入备注" clearable />
                                </el-form-item>
                                <div style="width:100%;text-align: center;margin-top:10px">
                                    <el-button type="primary" icon="el-icon-success" :disabled="isDisReturn"
                                        @click="returnsubmitForm">退费</el-button>
                                </div>
                            </el-form>
                            <div class="payment_records">退费记录</div>
                            <el-table v-loading="loading" :data="historyList" border
                                @selection-change="handleSelectionChange">
                                <!-- <el-table-column type="selection" width="50" align="center" fixed="left" /> -->
                                <el-table-column label="交易单号" align="center" key="orderNo" prop="orderNo"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="交易状态" align="center" key="orderStatus" prop="orderStatus"
                                    :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.orderStatus == 0">失败</span>
                                        <span v-if="scope.row.orderStatus == 1">成功</span>
                                    </template>
                                </el-table-column>

                                <el-table-column label="交易金额(元)" align="center" key="paidAmount" prop="paidAmount"
                                    :show-overflow-tooltip="true" width="100" />
                                <el-table-column label="账户余额(元)" align="center" key="balanceAmount" prop="balanceAmount"
                                    :show-overflow-tooltip="true" width="100" />
                                <!-- <el-table-column label="缴费时间" align="center" key="deptName" prop="dept.deptName"
                                    :show-overflow-tooltip="true" /> -->
                                <el-table-column label="交易时间" align="center" key="payTime" prop="payTime"
                                    :show-overflow-tooltip="true" />
                                <el-table-column label="支付方式" align="center" key="tradeType" prop="tradeType"
                                    :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.tradeType == 4">退费</span>
                                    </template>
                                </el-table-column>
                                <el-table-column label="备注" align="center" key="remark" prop="remark"
                                    :show-overflow-tooltip="true" />
                                <!-- <el-table-column label="操作" align="center" key="userName" prop="userName" fixed="right"
                                    width="100">
                                    <template slot-scope="scope">
                                        <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
                                        <el-button type="text" size="small">编辑</el-button>
                                    </template>
                                </el-table-column> -->


                            </el-table>
                            <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" small="true"
                                layout="total, prev, pager, next, jumper" :limit.sync="queryParams.pageSize"
                                @pagination="getPayMarkList" />
                        </el-card>
                    </el-col>
                </el-row>
            </el-col>

        </el-row>

        <!-- 添加或修改小区配置对话框 -->
        <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
            <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="类型" prop="nickName">
                            <el-select v-model="form.cons_type" filterable placeholder="请选类型" style="width:100%">
                                <el-option label="片区" value="1"> </el-option>
                                <el-option label="小区" value="2"> </el-option>

                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="名称" prop="nickName">
                            <el-input v-model="form.nickName" placeholder="请输入名称" maxlength="30" />
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="省市区" prop="nickName">
                            <el-cascader placeholder="试试搜索：指南" :options="options" filterable
                                style="width:100%"></el-cascader>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="详细地址" prop="nickName">
                            <el-input v-model="form.nickName" placeholder="请输入详细地址" maxlength="30" />
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitForm">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>
    </div>
</template>
  
<script>
import {
    listUser,
    getUser,
    delUser,
    addUser,
    updateUser,
    deptTreeSelect,
} from "@/api/system/user";
import { payList, getPay, payRemakList, getPayID, payRemakInfo } from "@/api/service/online.js"
import { areaTreeList } from "@/api/fileManagement/areainfo.js"
import { customeList, customeInfo } from "@/api/fileManagement/civilArchives.js"

export default {
    name: "areaDefinition",
    components: {},
    dicts: ["customer_type"],
    data() {
        return {
            isDisReturn: false,
            // 遮罩层
            loading: true,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 小区表格数据
            userList: null,
            historyList: null,
            // 弹出层标题
            title: "",
            // 企业树选项
            deptOptions: undefined,
            // 是否显示弹出层
            open: false,
            // 企业名称
            deptName: undefined,
            // 表单参数
            form: {},
            defaultProps: {
                children: "children",
                label: "label",
            },
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                customerType: null,
                customerName: null,
                telephone: null,
                supportNet: 1,
                isBlack: 'N'
            },
            // 表单校验
            rules: {
                userName: [
                    { required: true, message: "小区名称不能为空", trigger: "blur" },
                    {
                        min: 2,
                        max: 20,
                        message: "小区名称长度必须介于 2 和 20 之间",
                        trigger: "blur",
                    },
                ],
                nickName: [
                    { required: true, message: "小区昵称不能为空", trigger: "blur" },
                ],
            },
            options: [

            ],
            formArr: {}, // 客户信息
            balance: 0,
        };
    },
    watch: {
        // 根据名称筛选企业树
        deptName(val) {
            this.$refs.tree.filter(val);
        },
    },
    created() {
        this.getList();
        this.getDeptTree();
    },
    methods: {
        // 退费金额
        paymentAmount(value) {
            console.log(typeof value)
            this.balance = Number(this.formArr.remainAmout) - Number(value)
            this.$set(this.formArr, 'balance', value)
            console.log(this.formArr)
        },
        // 退费
        returnsubmitForm() {
            if (!this.formArr.paidAmount) {
                this.$modal.msgError("请填写退费金额");
                return
            }
            if (!this.formArr.tradeType) {
                this.$modal.msgError("请选择交易方式");
                return
            }
            if (Number(this.formArr.paidAmount) > this.formArr.remainAmout) {
                this.$modal.msgError("退费金额不能大于账户余额");
                return
            }
            console.log(this.formArr.remainAmout, this.formArr.paidAmount, 'this.formArr.paidAmount===');
            this.isDisReturn = true;
            getPayID('2').then((res) => {
                let param = {
                    type: '2', // 1=：开户,2=：购气,3=：补卡
                    paidAmount: this.formArr.paidAmount,
                    payAmount: this.formArr.paidAmount,
                    flowNo: res.data,
                    remark: this.formArr.remark,
                    tradeType: this.formArr.tradeType,
                    customerId: this.formArr.id
                }
                getPay(param).then((rep) => {
                    setTimeout(() => {
                        this.isDisReturn = false;
                    }, 2000);
                    console.log(rep)
                    if (rep.code === 200) {
                        this.$modal.msgSuccess("退费成功");
                        customeInfo(this.formArr.id).then((res) => {
                            console.log(res)
                            this.formArr = res.data
                        })
                        this.getPayMarkList()
                    }
                }).catch(() => {
                    this.isDisReturn = false;
                })
            })
        },
        // 退费记录
        getPayMarkList() {
            let param = {
                customerId: this.formArr.id,
                payType: '0', // 1缴费0退费
            }
            payRemakList(param).then((res) => {
                console.log(res)
                this.historyList = res.rows
            })
        },
        // 点击表格某一行
        tableClick(row) {
            customeInfo(row.id).then((res) => {
                console.log(res)
                this.formArr = res.data
                this.$set(this.formArr, 'remark', '')
                this.balance = this.formArr.remainAmout;
                this.getPayMarkList()
            })


        },
        /** 查询小区列表 */
        getList() {
            this.loading = true;
          let search = this.queryParams;
          search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
          search.params['meterCode'] = search.meterCode;
            customeList(this.queryParams).then((response) => {
                this.userList = response.rows;
                this.total = response.total;
                this.loading = false;
            });
        },
        /** 查询企业下拉树结构 */
        getDeptTree() {
            areaTreeList().then((response) => {
                this.deptOptions = response.data;
            });
        },
        // 筛选节点
        filterNode(value, data) {
            if (!value) return true;
            return data.label.indexOf(value) !== -1;
        },
        // 节点单击事件
        handleNodeClick(data) {
            this.queryParams.areaId = data.id;
            this.handleQuery();
        },
        // 取消按钮
        cancel() {
            this.open = false;
            this.reset();
        },
        // 表单重置
        reset() {
            this.form = {
                userId: undefined,
                deptId: undefined,
                userName: undefined,
                nickName: undefined,
                password: undefined,
                phonenumber: undefined,
                email: undefined,
                sex: undefined,
                status: "0",
                remark: undefined,
                postIds: [],
                roleIds: [],
            };
            this.resetForm("form");
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.queryParams.deptId = undefined;
            this.$refs.tree.setCurrentKey(null);
            this.handleQuery();
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map((item) => item.userId);
            this.single = selection.length != 1;
            this.multiple = !selection.length;
        },
        /** 新增按钮操作 */
        handleAdd() {
            this.reset();
            getUser().then((response) => {
                this.postOptions = response.posts;
                this.roleOptions = response.roles;
                this.open = true;
                this.title = "添加小区";
            });
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
            this.reset();
            const userId = row.userId || this.ids;
            getUser(userId).then((response) => {
                this.form = response.data;
                this.postOptions = response.posts;
                this.roleOptions = response.roles;
                this.$set(this.form, "postIds", response.postIds);
                this.$set(this.form, "roleIds", response.roleIds);
                this.open = true;
                this.title = "修改小区";
                this.form.password = "";
            });
        },
        /** 提交按钮 */
        submitForm: function () {
            this.$refs["form"].validate((valid) => {
                if (valid) {
                    if (this.form.userId != undefined) {
                        updateUser(this.form).then((response) => {
                            this.$modal.msgSuccess("修改成功");
                            this.open = false;
                            this.getList();
                        });
                    } else {
                        addUser(this.form).then((response) => {
                            this.$modal.msgSuccess("新增成功");
                            this.open = false;
                            this.getList();
                        });
                    }
                }
            });
        },
        /** 删除按钮操作 */
        handleDelete(row) {
            const userIds = row.userId || this.ids;
            this.$modal
                .confirm('是否确认删除小区编号为"' + userIds + '"的数据项？')
                .then(function () {
                    return delUser(userIds);
                })
                .then(() => {
                    this.getList();
                    this.$modal.msgSuccess("删除成功");
                })
                .catch(() => { });
        },
        /** 导出按钮操作 */
        handleExport() {
            this.download(
                "system/user/export",
                {
                    ...this.queryParams,
                },
                `user_${new Date().getTime()}.xlsx`
            );
        },
        /** 导入按钮操作 */
        handleImport() {
            this.upload.title = "小区导入";
            this.upload.open = true;
        },
        /** 下载模板操作 */
        importTemplate() {
            this.download(
                "system/user/importTemplate",
                {},
                `user_template_${new Date().getTime()}.xlsx`
            );
        },
        // 文件上传中处理
        handleFileUploadProgress(event, file, fileList) {
            this.upload.isUploading = true;
        },
        // 文件上传成功处理
        handleFileSuccess(response, file, fileList) {
            this.upload.open = false;
            this.upload.isUploading = false;
            this.$refs.upload.clearFiles();
            this.$alert(
                "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
                response.msg +
                "</div>",
                "导入结果",
                { dangerouslyUseHTMLString: true }
            );
            this.getList();
        },
        // 提交上传文件
        submitFileForm() {
            this.$refs.upload.submit();
        },
    },
};
</script>
<style lang="scss">
.head-containers {
    width: 200px;
    overflow: auto;

    .el-tree {
        min-width: 100%;
        display: inline-block !important;
    }
}

.elcol {
    margin-bottom: 5px;
}

.payment_records {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    margin-bottom: 10px;
}

.label_sty {
    color: red;
    display: inline-block;
    min-width: 130px;
    text-align: right;
    padding-right: 12px;
    font-weight: 400;
    background-color: #f6f6f6;
}

.form_item .el-form-item__label {
    background-color: #f6f6f6;
    color: #333;
    border: 1px solid #ebeef5;
}

.box-card_table {
    display: flex;
    width: 100%;
    justify-content: flex-start;
}

.return .el-form-item--small.el-form-item {
    margin-bottom: 0px
}
</style>
